import {Layouts} from './component/layout';
import zh_CN from './component/i18n/zh_CN';
import en_US from './component/i18n/en-US';
import emitter from './utils/events';
import zhCN from 'antd/lib/locale-provider/zh_CN';


/**
 * @description 浏览器端组件
 */
export class ClientEntry extends React.Component {
    constructor(props) {
        super(props);
        window.localStorage.languages = window.localStorage.languages || navigator.languages[0].substring(0, 2);
        this.state = {
            languages: window.localStorage.languages,
        };
        this.props = props;
        this.chooseLocale = this.chooseLocale.bind(this);
    }

    componentWillMount() {
        this.eventEmitter = emitter.addListener('changeLanguages', (language) => {
            window.localStorage.languages = language;
            this.setState({
                languages: window.localStorage.languages,
            });
        });
    }

    componentWillUnmount() {
        emitter.removeListener(this.eventEmitter);
    }

    chooseLocale(opt) {
        if (opt === null) {
            window.localStorage.languages = window.localStorage.languages || navigator.languages[0].substring(0, 2);
            switch (window.localStorage.languages) {
                case 'zh':
                    return zh_CN;
                    break;
                default:
                    return en_US;
                    break;
            }
        } else {
            switch (opt) {
                case 'zh':
                    return zh_CN;
                    break;
                default:
                    return en_US;
                    break;
            }
        }
    }

    render() {
        return <ReactRouterDom.HashRouter>
            <Antd.LocaleProvider locale={zhCN}>
                <Layouts languages={this.chooseLocale(this.state.languages)}/>
            </Antd.LocaleProvider>
        </ReactRouterDom.HashRouter>;
    }
}

ReactDom.hydrate(
    <ClientEntry/>,
    document.getElementById('main'),
);


